/********************************************
结果查看页面
** */
<template>
  <div class="mod-config">
    <basic-container>

      <!--头部 流程走势图-->
      <headDailyExnamine :sign="{ a: false, b: false, c:false ,d:false ,e:false,f:true}"></headDailyExnamine>

      <div  class="boxsty zhiBiao">
        <div :height="searchheight">
          <span
            style="float:right;margin-top: -30px;cursor: pointer;"
            @click="searchchangeadvanced"
          >
            {{ searchadvanced ? "查询条件收起" : "查询条件展开" }}
            <i
              :class="searchadvanced ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"
            />
          </span>
          <div v-show="searchadvanced">
            <el-form
              :inline="true"
              :model="searchForm"
              @keyup.enter.native="getDataList()"
              class="form-inline"
            >
              <el-form-item label="标题">
                <el-input v-model="searchForm.sjbt" placeholder="请输入标题关键字" :clearable="true"></el-input>
              </el-form-item>
              <el-form-item label="描述">
                <el-input v-model="searchForm.sjdesc" placeholder="请输入描述" :clearable="true"></el-input>
              </el-form-item>
              <el-form-item label="考核周期">
                <el-select
                  v-model="searchForm.khzq"
                  placeholder="请选择周期"
                  class="xiaLa"
                  @change="searchByZq"
                  style="width: 100%"
                  :clearable="true"
                >
                  <el-option
                    v-for="(item, index) in kezqsList"
                    :key="index"
                    :label="item.name"
                    :value="item.name"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-button
                  icon="el-icon-search"
                  type="primary"
                  class="marginLeft"
                  @click="getDataList(1)"
                >检索</el-button><!--v-if="permissions.zxgz_zxgzgzcj_view"-->
              </el-form-item>
            </el-form>
          </div>
        </div>

        <!--同意 驳回 操作按钮-->
        <div class="mt10" style="overflow:hidden;border-bottom:  1px solid #b0bde2;">
        </div>

        <!--table标签 切换-->
        <div style="margin-top: 20px">
          事件考核
          <span>
                <el-radio v-model="radio" label="1">人员</el-radio>
                <el-radio v-model="radio" label="2">机构</el-radio>
              </span>
        </div>

        <!--数据列表-->
        <el-table
          style="width: 100%;margin-top:20px"
          :data="dataList"
          border
          stripe
          ref="table"
          header-align="center"
          v-loading="dataListLoading"
        >
          <!-- <el-table-column type="selection" align="center"></el-table-column>-->
          <el-table-column type="index"  :index="indexMethod" header-align="center" align="center" label="序号" width="55"></el-table-column>
          <el-table-column prop="username" align="center" label="员工编号" show-overflow-tooltip sortable width="120"  v-if="radio==1"></el-table-column>
          <el-table-column prop="realname" align="center" label="姓名" show-overflow-tooltip sortable width="120" v-if="radio==1"></el-table-column>
          <el-table-column prop="deptName" align="center" label="部门" show-overflow-tooltip sortable width="120" v-if="radio==1"></el-table-column>
          <el-table-column prop="realname" align="center" label="部门" show-overflow-tooltip sortable width="120" v-if="radio==2"></el-table-column>
          <el-table-column prop="sjbt" align="center" label="标题" show-overflow-tooltip sortable  width="150"></el-table-column>
          <el-table-column prop="sjdesc" align="center" label="描述" show-overflow-tooltip  sortable width="150"></el-table-column>
        <!--  <el-table-column prop="yj" align="center" label="依据" show-overflow-tooltip sortable width="120"></el-table-column>-->
          <el-table-column prop="zbgz" align="center" label="指标规则" show-overflow-tooltip sortable width="120"></el-table-column>
          <el-table-column prop="jkfz" align="center" label="加扣分值" show-overflow-tooltip sortable width="120"></el-table-column>
          <el-table-column prop="jkjj" align="center" label="加扣奖金" show-overflow-tooltip sortable width="120"></el-table-column>
          <el-table-column prop="khzq" align="center" label="考核周期"  width="120" show-overflow-tooltip></el-table-column>
          <el-table-column prop="createTime" align="center" label="创建时间"  width="120" show-overflow-tooltip></el-table-column>
          <el-table-column prop="sszt" align="center" label="状态">
            <template slot-scope="scope">
              {{scope.row.sszt |transState}}
            </template>
          </el-table-column>
          <el-table-column align="center" fixed="right"  label="操作" width="120">
            <template slot-scope="scope">
              <el-button
                type="primary"
                plain
                size="small"
                @click="appealView(scope.row)"
              >处理</el-button><!-- v-if="permissions.zxgz_zxgzgzcj_view"-->
            </template>
          </el-table-column>
        </el-table>

        <!--分页-->
        <div class="avue-crud__pagination">
          <el-pagination
            @size-change="sizeChangeHandle"
            @current-change="currentChangeHandle"
            :current-page="pageIndex"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            :total="totalPage"
            background
            layout="total, sizes, prev, pager, next, jumper"
          ></el-pagination>
        </div>
      </div>
    </basic-container>


    <!--选择部门人员组件-->
    <replyToAppeal v-if="replyVisible" ref="appealNode" @closeAppealDialog="closeAppealDialog" @refreshDataList="refreshDataList"></replyToAppeal>
  </div>
</template>

<script>
    // 接口 api
    import {eventExamineList,leaderAudition,showUserName,dataDetail,khdxConfirm,getObj } from "@/api/dailyExamine/eventExamine/appealHandle.js";
    import {getKhzqSelect} from "@/api/dailyExamine/eventExamine/event.js";
    import replyToAppeal from "@/views/dailyExamine/eventExamine/appealHandle/replyToAppeal";
    import { mapGetters, mapState } from "vuex";
    import { showMessage } from "@/api/activiti/task";
    import store from "@/store";
    export default {
        components: {
            replyToAppeal
        },
        data() {
            return {
                headers: {
                    Authorization: "Bearer " + store.getters.access_token
                },
                replyVisible: false,
                joinConfirmVisible: false,
                dataForm: {},
                radio:'1',
                searchForm: {},
                multipleSelection: [], //表格中被选中的数据
                dataList: [],
                hisTableData: [],
                actPicUrlList: [],
                actPicUrl: "",
                showPicDialog: false,
                getCryItem:"",
                dataListLoading: false,
                searchadvanced: true,
                searchheight: "0",
                pageIndex: 1,
                pageSize: 10,
                totalPage: 0,
                isAgreeOrRefuse: true,
                canConfirm: true,
                kezqsList: [],
                type:0// 0 驳回 1同意
            };
        },
        filters: {
            transState(val) {
                switch (val) {
                    case 0:
                        return "待确认";
                        break;
                    case 1:
                        return "申诉中";
                        break;
                    case 2:
                        return "申诉通过";
                        break;
                    case 3:
                        return "申诉被驳回";
                        break;
                    case 4:
                        return "已作废";
                        break;
                    case 5:
                        return "已确认";
                        break;
                    case 25:
                        return "已确认";
                        break;
                    case 35:
                        return "已确认";
                        break;
                    case 45:
                        return "已确认";
                        break;
                    default:
                        break;
                }
                // 0待确认
                // 1申诉中
                // 2申诉通过
                // 3申诉被驳回
                // 4已作废
                // 5已确认
                // 25 申诉通过,已确认
                // 35 申诉被驳回,已确认
                // 45 作废,已确认
                //
                // 0 显示 确认
                // 1 隐藏 确认
                // 2 显示 确认
                // 3 显示 确认
                // 4 显示 确认
                // 5 隐藏 确认
                //
                // ssFlag   0 隐藏申诉   1显示申诉
            }
        },
        watch: {
            radio(value) {
                this.pageIndex = 1;
                if (value) {
                    this.dataList = [];
                    this.getDataList();
                    this.$nextTick(() => {
                        this.$refs.table.doLayout();
                    });
                }
            }
        },
        created() {
           // this.getUserInfo();
            this.getDataList();
            this.getKhzq();//考核周期
        },
        computed: {
            ...mapGetters(["permissions"])
        },
        methods: {
            searchchangeadvanced() {
                this.searchadvanced = !this.searchadvanced;
                if (this.searchadvanced) {
                    this.searchheight = "auto";
                }
            } ,
            //点查看 查询详情
            dataView(row) {
                dataDetail(row.id).then(r => {
                    this.detailVisible = true;
                    this.$nextTick(() => {
                        r.data = row ;
                        this.$refs.detailNode.init(r.data);
                    });
                });
            },

            //点申诉
            appealView(row) {
                dataDetail(row.id).then(r => {
                    this.replyVisible = true;
                    this.$nextTick(() => {
                       // r.data = row ;
                        this.$refs.appealNode.init(r.data.data);
                    });
                });
            },



            //刷新
            refreshDataList(){
                this.getDataList() ;
            },

            // 获取数据列表
            getDataList() {
                let khtype = "";
                if(this.radio == 1){
                    khtype = 'ry';
                }
                if(this.radio == 2){
                    khtype = 'jg';
                }
                this.dataListLoading = true;
                eventExamineList(
                    Object.assign(
                        {
                            current: this.pageIndex,
                            size: this.pageSize,
                            sjbt:this.searchForm.sjbt,
                            sjdesc:this.searchForm.sjdesc,
                            khzq: this.searchForm.khzq,
                            khtype:khtype,
                        }
                    ),
                    1
                )
                    .then(response => {
                        //获取用户信息
                       // this.getUserInfo() ;
                        this.dataList = response.data.data.records;
                        this.totalPage = response.data.data.total;
                        this.dataListLoading = false;
                    })
                    .catch(() => {
                        this.dataListLoading = false;
                    });
            },
            // 每页数
            sizeChangeHandle(val) {
                this.pageSize = val;
                this.pageIndex = 1;
                this.getDataList();
            },
            // 当前页
            currentChangeHandle(val) {
                this.pageIndex = val;
                this.getDataList();
            },
            //table表索引
            indexMethod(index) {
                return (this.pageIndex-1)*this.pageSize+index+1;
            },

            closeAppealDialog() {
                this.replyVisible = false;
            },
            showUser(taskId) {
                this.taskId = taskId;
                this.usercommentTask = true;
                this.$nextTick(() => {
                    this.$refs.userTask.init("", "zxshr", JSON.stringify([]), "htcj");
                });
            },
            //显示流程图弹框
            showMessage(proId) {
                showMessage(proId).then(res => {
                    this.hisTableData = res.data.data;
                });
                this.actPicUrl = `/act/sp/view/` + proId;
                this.actPicUrlList = [];
                this.actPicUrlList.push(`/act/sp/view/` + proId);
                this.showPicDialog = true;
            },

            //获取登录人信息
            getUserInfo(){
                let id = JSON.parse(sessionStorage.getItem('bfcloud-userInfo')).content.userId ;
                console.log(id)
                getObj(id).then(r=>{
                    let data = r.data.data ;
                    console.log(r) ;
                })
            }  ,
            //获取考核周期列表
            getKhzq(){
                getKhzqSelect().then(r => {
                    r.data.data.forEach((ele) => {
                        let item = {
                            name:ele.period,
                            value:ele.id
                        }
                        this.kezqsList.push(item);

                    });
                });
            } ,
            searchByZq(){
                this.getDataList() ;
            }

        }
    };
</script>

<style lang="scss" scoped>
</style>
